<template>
	<view class="">
		<view class="bg-white pl-20 pr-20 pt-20">
			<view class="flex justify-between ">
				<view 
					class="tag" 
					:class="submitData.type===tag.value?'tag-bg-brisk':'tag-bg-default'" 
					v-for="(tag, tagIx) in tags" 
					:key="tagIx"
					@click="submitData.type = tag.value"
				>
					{{tag.label}}
				</view>
			</view>
			<view class="pt-20">回访备注(500字内)</view>
		</view>
		<view class="textarea">
			<u-textarea 
				v-model="submitData.notes" 
				height="140" 
				placeholder="选填,请输入本次回访内容" 
				border="none" 
				count 
				maxlengt="500"
			/>
		</view>
		<view class="smbtn">
			<u-button text="确认添加" size="large" color="#e54d42" shape="circle" @click="onSubmit"/>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	export default {
		data(){
			return {
				isEdit: false,
				tags: [
					{label:'电话', value:1},
					{label:'短信', value:2},
					{label:'微信', value:3},
					{label:'其他', value:4}
				],
				submitData:{
					type: 1 ,
					userId: '',
					notes:'',
				}
			}
		},
		onLoad(opt){
			if(opt.id){
				this.isEdit = true
				this.submitData.userId = opt.userId
				uni.setNavigationBarTitle({
					title:'编辑回访记录'
				})
				this.getDetail(opt.userId, opt.id)
			}else {
				this.submitData.userId = opt.userId
			}
		},
		methods: {
			getDetail(userId, id){
				this.$reqJsonPost('UserVisitDetails', { userId: userId, id:id }).then(res=>{
					this.submitData = res.data
				})
			},
			onSubmit(){
				this.$reqJsonPost(this.isEdit?'UserVisitDoEdit':'UserVisitDoCreate', this.submitData).then(res=>{
					this.$refs.uToast.show({
						message: res.msg,
						complete(){
							uni.$emit('uplist', 3)
							uni.navigateBack()
						}
					})
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.tag{
		width: 81px;
		height: 42px;
		line-height: 42px;
		text-align: center;
		border-radius:5px;
	}
	.tag-bg-brisk{
		background-color: #e54d42;
		color: #fff;
	}
	.tag-bg-default{
		background-color: #f8f8f8;
		color: #999;
	}
	.smbtn{
		width: 120px;
		margin: 40px auto;
	}
</style>